Introduction
In this lesson, we'll look at a quick introduction to ESI concepts and what this chapter holds for us.
We'll cover the following
ESI: concepts#
Servers can also integrate multiple frontends. This chapter focuses on ESI (Edge Side Includes).
ESI (Edge Side Includes) enables web applications to integrate HTML fragments of another web application (See the drawing below). To do so, the web application sends HTML containing ESI tags.
The ESI implementation analyzes the ESI tags and integrates HTML fragments of other web applications in the right positions.
Caches implement ESI#
In the example, the web cache Varnish serves as an ESI implementation. Other caches, such as Squid, also support ESI. Websites use these caches to deliver web pages out of the cache upon incoming requests.
The servers handle requests only for cache-misses. This speeds up the website and decreases the load of the web servers.
CDNs implement ESI#
Content Delivery Networks (CDNs) such as Akamai also implement the ESI standard. In principle, CDNs serve to deliver static HTML pages and images.
To do so, CDNs run servers at several Internet nodes so that every user can load web pages and images from a nearby server, thus reducing loading times.
Via the support of ESI, the assembling of HTML fragments can be done on a server that is close to the user. CDNs and caches implement ESI to be able to assemble web pages from different fragments.
Static parts can be cached, even if other parts have to be dynamically generated. This makes it possible to at least partially cache dynamic web pages which otherwise would have to be excluded from caches completely. This improves performance.
Therefore, ESI not only offers features for frontend integration but also features especially useful for caching.
Chapter walkthrough#
Readers discover the following:
-
How the web cache Varnish implements ESI.
-
How applications can implement an integration using ESI.
-
What benefits and disadvantages ESI has and what alternatives to ESI exist for implementing server-side frontend integration.
Q U I Z
What is Edge Side Includes?
A)
A new frontend web framework.
B)
A JavaScript method for including information dynamically in HTML.
C)
A markup language used to include content dynamically into web pages.
In the next lesson, we’ll look at an example of how Edge Side Includes (ESI) can be used to assemble HTML fragments from different sources and how the entire HTML can be sent to the browser.